<template>
<el-drawer v-model="visible" :title="gitModuleInfo.moduleName"  size="40%" :append-to-body="true" :show-close="false" @close="validData()">
	
	<template #header="{ close, titleId, titleClass }">
      <h4 :id="titleId" :class="titleClass">{{gitModuleInfo.moduleName}}</h4>
      <el-button type="danger" @click="close">
		<el-icon><Delete /></el-icon>
      </el-button>
    </template>

	<el-form ref="dataFormRef" :model="dataForm" label-position="top">
		<el-form-item prop="uri" label="clone方式" >
			<el-select v-model="dataForm.uriType">
				<el-option
				v-for="item in gitCloneTypeMap"
				:key="item.value"
				:label="item.label"
				:value="item.value"
				/>
			</el-select>
		</el-form-item>

		<el-form-item prop="uri" label="git地址"
			:rules="{required: true,message: 'git地址不能为空',trigger: 'blur',}">
	 		<el-input v-model="dataForm.uri" placeholder="请输入git地址" style="width:250px"></el-input>
   		</el-form-item>

		<el-form-item v-if=" dataForm.uriType == '2' " prop="gitUserName" label="账户" 
			:rules="{required: true,message: '账户不能为空',trigger: 'blur',}">
	 		<el-input v-model="dataForm.gitUserName" placeholder="请输入git仓库账户" style="width:250px"></el-input>
   		</el-form-item>

		<el-form-item v-if=" dataForm.uriType == '2' " prop="gitUserPassword" label="密码"
			:rules="{required: true,message: '密码不能为空',trigger: 'blur',}">
	 		<el-input v-model="dataForm.gitUserPassword" placeholder="请输入git仓库账户密码" style="width:250px"></el-input>
   		</el-form-item>

	</el-form>
</el-drawer>
</template>

<script setup lang="ts">
import { reactive, ref,onMounted } from 'vue'
import {
	Edit,
} from '@element-plus/icons-vue'
const visible = ref(false)
const dataFormRef = ref()
const gitModuleInfo = ref<any>({})
const dataForm = reactive({
	uriType:'1',
	uri:'',
	gitUserName:'',
	gitUserPassword:'',
	version:'',
})


const init =(item:any) => {
	gitModuleInfo.value = item
	visible.value = true
}

const gitCloneTypeMap = [
  {
    value: '1',
    label: 'SSH',
  },
  {
    value: '2',
    label: 'HTTPS',
  },
]

const validData = async() => {
	
	let flag = true;
	await dataFormRef.value.validate((valid: boolean) => {
    if(!valid){
		flag = false
    }else{
		flag = true
			gitModuleInfo.value.moduleContent = JSON.stringify(dataForm)
		}
    })
	return flag
}

defineExpose({
	init,validData
})
</script>